<template>
  <div id="BuildingServer" ref="BuildingServer">
    <!-- <div>
      <TimeLine></TimeLine>
    </div>-->
    <!-- <div style="height:30px;background:#eee"></div> -->
    <!--<div class="title">-->
    <!--<span style="position: absolute;left: 5px;display: flex;align-items: center;font-size: 14px;">-->
    <!--&lt;!&ndash; <van-icon name="arrow-left" />-->
    <!--返回 &ndash;&gt;-->
    <!--</span>-->
    <!--图集服务-->
    <!--</div>-->
    <div class="top" v-show="$route.query.data">
      <img style="width: 80%; margin: 0 auto" src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/SQ/4.png" />
      <p>
        <span :class="showMoble ? '' : 'PADD1'" style="width: 22%; display: inline-block; text-align: center">申请</span>
        <span style="width: 26%; display: inline-block; text-align: center">选图选工匠</span>
        <span style="width: 25%; display: inline-block; text-align: center">签订合同</span>
        <span :class="showMoble ? '' : 'PADD2'" style="width: 21%; display: inline-block; text-align: center">竣工验收</span>
      </p>
    </div>
    <div
      :class="{
        pcStyle: !showMoble,
        smallFontSize: showEdition,
        mediumFontSize: !showEdition
      }">
      <!--<el-tabs v-model="activeName" @tab-click="handleClick">-->
      <!--<el-tab-pane :class="{smallFontSize:showEdition,mediumFontSize:!showEdition}" label="免费图集" name="second">-->

      <!--</el-tab-pane>-->
      <!--<el-tab-pane label="我的收藏" name="first"></el-tab-pane>-->
      <!--<el-tab-pane label="图集上传" name="third">-->
      <!--<div>-->
      <!--<ul>-->
      <!--<li style="height:30px;border-bottom:1px solid #eee;margin-top:10px" v-for="item in datatable" :key="item">-->
      <!--<span>{{item.left}}</span>-->
      <!--<span v-if="item.right" style="float:right">{{item.right}}</span>-->
      <!--<span v-else-if="item.left=='图集文件（dwg）'" style="float:right">-->
      <!--<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3" :on-exceed="handleExceed" :file-list="fileList">-->
      <!--<el-button size="mini" type="primary">点击上传</el-button>-->
      <!--</el-upload>-->
      <!--</span>-->
      <!--<span v-else-if="item.left=='图集文件（pdf）'" style="float:right">-->
      <!--<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3" :on-exceed="handleExceed" :file-list="fileList">-->
      <!--<el-button size="mini" type="primary">点击上传</el-button>-->
      <!--</el-upload>-->
      <!--</span>-->
      <!--</li>-->
      <!--</ul>-->
      <!--<div style="position:fixed;bottom:0">-->
      <!--<el-button size="mini" type="primary" style="width:100vw">提交</el-button>-->
      <!--</div>-->
      <!--</div>-->
      <!--</el-tab-pane>-->
      <!--</el-tabs>-->
      <van-tabs :class="{ smallFontSize: showEdition, mediumFontSize: !showEdition }" color="#3F8FFC" v-model="activeName" @click="onClick">
        <van-tab title="免费图集">
          <PhotoServer></PhotoServer>
        </van-tab>
        <van-tab title="我的收藏">
          <div>
            <div style="height: 60vh; text-align: center; padding-top: 20vh" v-if="imagesList.length == 0">
              <div style="margin-bottom: 10px">
                <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
              </div>
              <div>暂无数据</div>
            </div>
            <template v-if="imagesList.length > 0">
              <div class="boxser" v-for="(item, index) in imagesList" :key="index" @click="handleGoto(item)">
                <p v-if="item.suolueFileId">
                  <!-- <img src='https://nfzjszlb.jst.zj.gov.cn/file/${{item.fileUrl}}?download=0&width=200' alt=""> -->
                  <img width="186" height="116" :src="baseurlid + item.suolueFileId" />
                </p>
                <p v-else>
                  <img width="186" height="116" src="https://nfzjszlb.jst.zj.gov.cn/tyzcpt/api/upload/oss/preview?fileId=3e7acb97b640411a9ce06017e7c12964" />
                </p>
                <div style="padding: 0">
                  <p>{{ item.floors ? item.floors : 0 }} |{{ item.area ? item.area : 0 }}m²</p>
                  <p style="font-weight: 800">{{ item.atlasName }}</p>
                  <p style="margin-left: 4px">
                    <span style="font-weight: 640">{{ item.countyName }}</span>
                    <span v-if="item.atlasType != null" style="font-weight: 640; float: right" @click="vrSee(item)">VR图集</span>
                    <span v-else style="font-weight: 640; float: right">通用图集</span>
                  </p>
                </div>
              </div>
            </template>
          </div>
        </van-tab>
        <van-tab title="图集上传">
          <van-form style="height: 100vh" :class="{ smallFontSize: showEdition, titleMediumFontSize1: !showEdition }" validate-first>
            <div class="linStyle">
              <span style="color: #ff0000">*</span>
              <van-field :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="formData.ATLAS_NAME" label="图集名称" placeholder="请输入图集名称" @click="ENUM.XB = true" />
            </div>
            <div class="linStyle">
              <span style="color: #ff0000">*</span>
              <van-field :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="formData.FLOORS" label="建筑层数 (层)" placeholder="请输入建筑层数(层)" />
            </div>
            <div class="linStyle">
              <span style="color: #ff0000">*</span>
              <van-field :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="formData.AREA" label="占地面积 (m²)" placeholder="请输入占地面积(m²)" />
            </div>
            <div class="linStyle">
              <span style="color: #ff0000">*</span>
              <van-field :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="formData.BUILD_AREA" label="建筑面积 (m²)" placeholder="请输入建筑面积(m²)" />
            </div>
            <div class="linStyle">
              <span style="color: #ff0000">*</span>
              <van-field :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="formData.technicalUnit.qymc" label="图集设计单位名称" placeholder="请输入图集设计单位名称" />
            </div>
            <!-- <div class="linStyle">
              <span>图集示例图</span>
              <el-upload
                :http-request="uploadFile"
                style="float: right"
                class="avatar-uploader"
                action="https://jsonplaceholder.typicode.com/posts/"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload"
                :multiple="true"
              >
                <img v-if="file[0].url" :src="file[0].url" class="avatar" />
                <el-button v-else size="mini" type="primary"
                  >点击上传</el-button
                >
              </el-upload>
            </div>
            <div class="linStyle">
              <span>图集缩略图</span>
              <el-upload
                :http-request="uploadFile1"
                style="float: right"
                class="avatar-uploader"
                action="https://jsonplaceholder.typicode.com/posts/"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload"
              >
                <img v-if="file[1].url" :src="file[1].url" class="avatar" />
                <el-button v-else size="mini" type="primary"
                  >点击上传</el-button
                >
              </el-upload>
            </div> -->
            <!-- <div class="linStyle">
              <span>图集文件(dwg)</span>
              <el-upload :http-request="uploadFile2" style="float:right" class="avatar-uploader" action="https://jsonplaceholder.typicode.com/posts/" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
                <p v-if="file[2].name" class="avatar" @click="openUrl(file[2].url)">{{file[2].name}}</p>
                <el-button v-else size="mini" type="primary">点击上传</el-button>
              </el-upload>
            </div>-->
            <!-- <div class="linStyle">
              <span>图集文件(pdf)</span>
              <el-upload
                :http-request="uploadFile3"
                style="float: right"
                class="avatar-uploader"
                accept=".pdf, .PDF"
                action="https://jsonplaceholder.typicode.com/posts/"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload"
                :on-remove="handleRemove"
              >
                <p
                  v-if="file[3].name"
                  class="avatar"
                  @click="openUrl(file[3].url)"
                >
                  {{ file[3].name }}
                </p>
                <el-button v-else size="mini" type="primary"
                  >点击上传</el-button
                >
              </el-upload>
            </div> -->
            <div class="linStyle" style="display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #d2d2d2">
              <span style="color: #ff0000">*</span>
              <van-field
                :style="{ fontSize: showEdition ? '14px' : '20px' }"
                readonly
                clickable
                name="picker"
                :value="formData.atlasStyle"
                label="自选图集"
                placeholder="请选择自选图集"
                @click="showPickerBT = true" />
              <van-popup :style="{ fontSize: showEdition ? '14px' : '20px' }" v-model="showPickerBT" position="bottom" get-container="#popup">
                <van-picker show-toolbar :columns="BUILDTYPEcolumns" value-key="DICNAME" @confirm="onConfirmBUILDTYPE1" @cancel="showPickerBT = false" />
              </van-popup>
            </div>
            <!-- <p style="height: 28px; display: flex; align-items: center; border-bottom: 1px solid #d2d2d2">
              <span style="margin-right: 10px" class="line"></span>
              <span style="color: #ff0000">*</span>图集示例图
            </p>
            <div>
              <van-uploader :after-read="uploadFile0" :before-delete="delectFile" v-model="fileList1" multiple />
            </div>
            <p style="height: 28px; display: flex; align-items: center; border-bottom: 1px solid #d2d2d2">
              <span style="margin-right: 10px" class="line"></span>
              <span style="color: #ff0000">*</span>图集缩略图
            </p>
            <div>
              <van-uploader :after-read="uploadFile1" :before-delete="delectFile" v-model="fileList2" multiple />
            </div>
            <p style="height: 28px; display: flex; align-items: center; border-bottom: 1px solid #d2d2d2">
              <span style="margin-right: 10px" class="line"></span>
              <span style="color: #ff0000">*</span>图集文件(pdf)
            </p>
            <van-button @click="handleGotoPdf" style="float: right; margin-top: -35px" size="small" type="info"
              >预览</van-button
            >
            <div>
              <van-uploader :after-read="uploadFile2" :before-delete="delectFile" v-model="fileList" multiple />
            </div> -->
            <div class="linStyle">
              <span><span style="color: #ff0000" :style="{ fontSize: showEdition ? '14px' : '20px' }">*</span><span :style="{ fontSize: showEdition ? '14px' : '20px' }">图集文件(pdf)</span></span>
              <el-upload
                :style="{ fontSize: showEdition ? '14px' : '20px' }"
                :http-request="uploadFile6"
                style="float: right"
                class="avatar-uploader"
                action="https://jsonplaceholder.typicode.com/posts/"
                :show-file-list="true"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload">
                <!-- <p :style="{fontSize:showEdition?'14px':'20px'}" v-if="file[3].name" class="avatar" @click="openUrl(file[3].url)">{{ file[3].name }}</p> -->
                <van-button :style="{ fontSize: showEdition ? '14px' : '20px' }" icon="plus" size="mini" type="primary">上传文件</van-button>
                <!-- <el-button  size="mini" type="primary">点击上传</el-button> -->
              </el-upload>
            </div>
            <div class="linStyle">
              <span><span :style="{ fontSize: showEdition ? '14px' : '20px' }">图集文件(cad)</span></span>
              <el-upload
                :style="{ fontSize: showEdition ? '14px' : '20px' }"
                :http-request="uploadFile7"
                style="float: right"
                class="avatar-uploader"
                action="https://jsonplaceholder.typicode.com/posts/"
                :show-file-list="true"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload">
                <!-- <p :style="{fontSize:showEdition?'14px':'20px'}" v-if="file[3].name" class="avatar" @click="openUrl(file[3].url)">{{ file[3].name }}</p> -->
                <van-button :style="{ fontSize: showEdition ? '14px' : '20px' }" icon="plus" size="mini" type="primary">上传文件</van-button>
                <!-- <el-button  size="mini" type="primary">点击上传</el-button> -->
              </el-upload>
            </div>
            <upLoad
              id="upLoad1"
              :rowData="rowData"
              :FJData="fileCUN"
              :CUNID="rowData?.ROW_GUID"
              :SHITUID="'98bcf528966e48ce896a8b3fd02d45d5'"
              :UpLoadID="'7a3fc061c866434b8475d3775c9ddcea'" />
            <div class="bottom" style="font-size: 14px; margin-top: 10px; padding: 6px">
              <van-radio-group v-model="radio">
                <van-radio name="1">设计单位承诺自审合格，不需要送图审机构审查</van-radio>
                <van-radio name="2">本图集送第三方图审</van-radio>
              </van-radio-group>
              <div style="display: flex; justify-content: space-around; padding-top: 20px">
                <van-button :style="{ fontSize: showEdition ? '14px' : '20px' }" type="info" @click="toHref()">自审合格证书模板下载</van-button>
                <van-button :style="{ fontSize: showEdition ? '14px' : '20px' }" type="info" @click="save()">提交</van-button>
              </div>
            </div>
          </van-form>
          <div class="footer">
            
          </div>
          <!-- <div>
            <ul>
              <li style="height:30px;border-bottom:1px solid #eee;margin-top:10px" v-for="item in datatable" :key="item">
                <span>{{item.left}}</span>
                <span v-if="item.right" style="float:right">{{item.right}}</span>
                <span v-else-if="item.left=='图集文件（dwg）'" style="float:right">
                  <el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3" :on-exceed="handleExceed" :file-list="fileList">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </el-upload>
                </span>
                <span v-else-if="item.left=='图集文件（pdf）'" style="float:right">
                  <el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3" :on-exceed="handleExceed" :file-list="fileList">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </el-upload>
                </span>
              </li>
            </ul>
            <div style="position:fixed;bottom:0">
              <el-button size="mini" type="primary" style="width:100vw">提交</el-button>
          </div>-->
          <!-- </div> -->
        </van-tab>
      </van-tabs>
    </div>
    <van-popup v-model="shoulm">
      <div class="con_box">
        <h3>{{ text.title }}</h3>
        <p>{{ text.message }}</p>
        <div class="btnv">
          <span @click="handleClose()" v-if="text.btn.cancelText">
            {{ text.btn.cancelText }}
          </span>
          <span @click="handleOk()" v-if="text.btn.okText">
            {{ text.btn.okText }}
          </span>
        </div>
      </div>
    </van-popup>
  </div>
</template>
<script>
import TimeLine from './timeLine.vue'
import upLoad from '@/utils/upLoad'
import PhotoServer from './PhotoServer.vue'
import { Loading } from 'element-ui'
import { AtlasCollection, loginJGPT, dataqueryFile, AtlasUpload, zhejiangHouseAtlasSave, ossUploadFiles, selectListByIds } from '@/utils/api'
export default {
  components: {
    TimeLine,
    upLoad,
    PhotoServer
  },
  data() {
    let me = this
    return {
      token: null,
      radio: '1',
      shoulm: false,
      ISTUJI: true,
      fileCUN: [
            {
                title: '自审承诺书',
                FileName: '无',
                groupGuid: "29a0b41d-6ab7-47c3-bf8c-f8ec593dc27b",
                fileList: [],
            }
        ],
      XZ: '',
      JD: '',
      text: {
        title: '温馨提示',
        message: '',
        btn: {
          okText: '确定',
          cancelText: '取消'
        }
      },
      showPickerBT: false,
      fileList: [],
      fileList1: [],
      fileList2: [],
      BUILDTYPEcolumns: [
        {
          DICNAME: '个人图集'
        },
        {
          DICNAME: '自选图集'
        }
      ],
      showEdition: false,
      showMoble: true, //初始化移动端相关内容的显示
      activeName: 'second',
      baseurl: window.g.BaseURL4,
      baseurls: window.g.OSSPriview,
      baseurlid: window.g.OSSPriviewId,
      imagesList: [],
      file: [
        {
          name: '',
          url: ''
        },
        {
          name: '',
          url: ''
        },
        {
          name: '',
          url: ''
        },
        {
          name: '',
          url: ''
        },
        {
          name: '',
          url: ''
        }
      ],
      datatable: [
        {
          left: '图集名称',
          right: '农户名'
        },
        {
          left: '建筑层数',
          right: 'XXX'
        },
        {
          left: '占地面积',
          right: 'XXX'
        },
        {
          left: '建筑面积',
          right: 'XXX'
        },
        {
          left: '所属区域',
          right: '杭州市-临安区-xx镇-xx村'
        },
        {
          left: '图集文件（dwg）',
          right: ''
        },
        {
          left: '图集文件（pdf）',
          right: ''
        }
      ],
      rowData:{},
      formData: {
        ATLAS_NAME: '',
        FLOORS: '',
        AREA: '',
        BUILD_AREA: '',
        LABD_TYPE: '',
        BELOGN_AREA: '',
        FILEID: '',
        FILEID1: '',
        FILEID2: '',
        FILEID3: '',
        FILEIDCAD:'',
        technicalUnit: {
          qymc: ''
        }
      }
    }
  },
  created() {
    this.rowData = JSON.parse(window.sessionStorage.getItem('fileData'))
    this.judgmentResolution()
    var enums = [
      {
        DICID: '552',
        DICNAME: '一'
      },
      {
        DICID: '553',
        DICNAME: '二'
      },
      {
        DICID: '554',
        DICNAME: '三'
      },
      {
        DICID: '555',
        DICNAME: '四'
      },
      {
        DICID: '556',
        DICNAME: '五'
      },
      {
        DICID: '557',
        DICNAME: '六'
      },
      {
        DICID: '558',
        DICNAME: '七'
      },
      {
        DICID: '559',
        DICNAME: '八'
      },
      {
        DICID: '560',
        DICNAME: '九'
      },
      {
        DICID: '561',
        DICNAME: '十'
      }
    ]
    if (JSON.parse(window.sessionStorage.getItem('fileData'))?.S) {
      this.formData.ATLAS_NAME = JSON.parse(window.sessionStorage.getItem('fileData')).HOUSEAPPLICANT + '自传图集'
      this.formData.AREA = JSON.parse(window.sessionStorage.getItem('fileData')).BUILDAREA
      this.formData.BUILD_AREA = JSON.parse(window.sessionStorage.getItem('fileData')).HOUSEFLOORAREA
      enums.forEach((item) => {
        if (JSON.parse(window.sessionStorage.getItem('fileData')).BUILDSTOREY == item.DICID) {
          this.formData.FLOORS = item.DICNAME
        }
      })
      console.log(this.formData.FLOORS)
    }
  },
  methods: {
    /* 分辨率区分--PC端+移动端 */
    judgmentResolution() {
      var sUserAgent = navigator.userAgent.toLowerCase()
      var bIsIpad = sUserAgent.match(/ipad/i) == 'ipad'
      var bIsIphoneOs = sUserAgent.match(/iphone os/i) == 'iphone os'
      var bIsMidp = sUserAgent.match(/midp/i) == 'midp'
      var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == 'rv:1.2.3.4'
      var bIsUc = sUserAgent.match(/ucweb/i) == 'ucweb'
      var bIsAndroid = sUserAgent.match(/android/i) == 'android'
      var bIsCE = sUserAgent.match(/windows ce/i) == 'windows ce'
      var bIsWM = sUserAgent.match(/windows mobile/i) == 'windows mobile'
      if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
        this.showMoble = true
      } else {
        this.showMoble = false
      }
    },
    async uploadFile6(file) {
      // this.uploadFileAll1(file, 'FILEID2', this.file[3])
      let formData = new FormData()
      formData.append('files', file.file)
      formData.append('path', 'DSFTJ')
      formData.append('groupName', '第三方图集')
      formData.append('toGroupGuid', '123')
      const res = await ossUploadFiles(formData)
      let data2 = res.data.data
      this.formData.FILEID2 = data2[0].id
      this.file[3].name = data2[0].name
      // this.formData.fileid = data2[0].id
      this.$toast.success('上传成功!')
    },
    async uploadFile7(file) {
      // this.uploadFileAll1(file, 'FILEID2', this.file[3])
      let formData = new FormData()
      formData.append('files', file.file)
      formData.append('path', 'DSFTJ')
      formData.append('groupName', '第三方图集')
      formData.append('toGroupGuid', '123')
      const res = await ossUploadFiles(formData)
      let data2 = res.data.data
      this.formData.FILEIDCAD = data2[0].id
      this.file[4].name = data2[0].name
      // this.formData.fileid = data2[0].id
      this.$toast.success('上传成功!')
    },
    async toHref(item) {
      let url = 'https://nfzjszlb.jst.zj.gov.cn/file/oss/DSFTJ/3717f6f10c284d89a1944d5d33669507.pdf'

      //跳转至view需要用户手动复制预览1
      //微信小程序需要端内打开1
      if (window.sessionStorage.getItem('showBg2') == 'true') {
        this.$router.push({
          path: '/PDFJSViewer',
          query: {
            path: url,
          },
        })
      } else {
        //根据id获取
        let url1 = 'https://nfzjszlb.jst.zj.gov.cn/file/oss/DSFTJ/3717f6f10c284d89a1944d5d33669507.pdf'
        //iphone先这样处理
        if (ZWJSBridge) {
          ZWJSBridge.openLink({
            url: url1,
          })
            .then((res) => {})
            .catch((err) => {
              window.open(url1)
            })
        }
      }
    },
    uploadFileAll1: async function (file, field, item) {
      let me = this
      me.fileData1 = new FormData()
      me.fileData1.append('file', file.file)
      let url = window.g.BaseURL + 'api/upload/file'
      let loading = Loading.service({
        fullscreen: true,
        text: '上传中...'
      })
      $.ajax({
        url: url,
        type: 'post',
        data: me.fileData1,
        dataType: 'json',
        processData: false,
        contentType: false,
        cache: false,
        async: true,
        beforeSend: function (XMLHttpRequest) {
          XMLHttpRequest.setRequestHeader('Authorization', me.token)
        },
        success: function (result) {
          loading.close()
          if (result.code == 200) {
            item.url = me.baseurl + result.data.path + '?download=0&width=100'
            item.name = result.data.name
            if (me.formData[field]) {
              me.formData[field] = me.formData[field] + ',' + result.data.id
            } else {
              me.formData[field] = result.data.id
            }
            me.$toast.success(result.msg)
            console.log(me.formData)
            // me.$notify({ type: 'success', message: result.msg });
          } else {
            me.$toast.fail(result.msg)
            // me.$notify({ type: 'error', message: result.msg });
          }
        },
        error: function (error) {
          me.$toast.fail(result.msg)
          loading.close()
        }
      })
    },
    handleGotoPdf() {
      // window.open('')
      if (!this.fileList[0]) {
        this.$toast.fail('暂无数据！')
      } else {
        ZWJSBridge.openLink({
          url: this.fileList[0].url
        })
          .then((res) => {})
          .catch((err) => {
            window.open(this.fileList[0].url)
          })
      }
    },
    onConfirmBUILDTYPE1(value) {
      this.formData.atlasStyle = value.DICNAME
      // this.formDataTR.buildtype = value.DICID
      this.showPickerBT = false
      //   if (value.DICNAME == '原址翻建') {
      //     this.JFLYcolumns = ['危房翻建']
      //   } else if (value.DICNAME == '异址新建') {
      //     this.JFLYcolumns = ['分户新建/无房新建', '按照规划迁址新建住房']
      //   }
    },
    afterRead(file) {
      this.uploadFileAll(file.file)
    },
    handleRemove(file, fileList) {},
    handleGoto(data) {
      debugger
      this.$router.push({
        path: '/PhotoThreePage',
        query: {
          data1: JSON.stringify(data),
          id: this.$route.query.id
        }
      })
    },
    //vr图集预览
    vrSee(item) {
      if (item.vrUrl) {
        let url = window.g.VrUrl + item.vrUrl
        if (ZWJSBridge) {
          ZWJSBridge.openLink({
            url: url
          })
            .then((res) => {})
            .catch((err) => {})
        }
      } else {
        this.$toast.fail('暂未配置！')
        // this.$notify({ type: 'info', message: '暂未配置！' });
      }
    },
    handleAvatarSuccess() {},
    beforeAvatarUpload() {},
    openUrl(url) {
      if (ZWJSBridge) {
        ZWJSBridge.openLink({
          url: url
        })
          .then((res) => {})
          .catch((err) => {})
      }
    },
    uploadFile0(file) {
      this.uploadFileAll(file, 'FILEID', this.fileList1[0])
    },
    uploadFile1(file) {
      this.uploadFileAll(file, 'FILEID3', this.fileList2[0])
    },
    uploadFile2(file) {
      this.uploadFileAll(file, 'FILEID1', this.fileList[0])
    },
    // uploadFile3(file) {
    //   this.uploadFileAll(file, "FILEID2", this.fileList[3]);
    // },
    uploadFileAll: async function (file, field, item) {
      let me = this
      me.fileData1 = new FormData()
      me.fileData1.append('file', file.file)
      let url = window.g.BaseURL + 'api/upload/file'
      let loading = Loading.service({
        fullscreen: true,
        text: '上传中...'
      })
      $.ajax({
        url: url,
        type: 'post',
        data: me.fileData1,
        dataType: 'json',
        processData: false,
        contentType: false,
        cache: false,
        async: true,
        beforeSend: function (XMLHttpRequest) {
          XMLHttpRequest.setRequestHeader('Authorization', me.token)
        },
        success: function (result) {
          loading.close()
          if (result.code == 200) {
            if (field != 'FILEID1') {
              item.url = me.baseurl + result.data.path + '?download=0&width=100'
            } else {
              item.url = me.baseurl + result.data.path + '?download=0'
            }
            item.name = result.data.name
            if (me.formData[field]) {
              me.formData[field] = me.formData[field] + ',' + result.data.id
            } else {
              me.formData[field] = result.data.id
            }
            me.$toast.success(result.msg)
            // me.$notify({ type: 'success', message: result.msg });
          } else {
            me.$toast.fail(result.msg)
            // me.$notify({ type: 'error', message: result.msg });
          }
        },
        error: function (error) {
          loading.close()
        }
      })
    },
    delectFile: async function (file) {
      // let fileguid = ''
      // if (file.ROW_GUID) {
      //   fileguid = file.ROW_GUID
      // } else {
      //   fileguid = this.fileGuid
      // }
      // if (fileguid) {
      //   let params = {
      //     accessCode: 'ce9b691634de4ebca68dc5bb638d07f4',
      //     cityCode: window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : '441300000000',
      //     params: {
      //       fileGuid: fileguid,
      //       token: window.localStorage.getItem('token')
      //     }
      //   }
      //   const res = await FileServerProxy(params)
      //   let data = JSON.parse(res.data.data).Success
      //   if (data) {
      //     this.$toast.success('删除成功!')
      //   }
      // }
    },
    //下载的文件https://nfzjszlb.jst.zj.gov.cn/tyzcpt/api/upload/oss/preview?fileId=998900b555064404856f55912916b763
    save: async function () {

          // do something
          if (this.$route.query.data10) {
            if (this.formData.ATLAS_NAME && this.formData.AREA && this.formData.FLOORS && this.formData.BUILD_AREA&& this.formData.technicalUnit.qymc) {
              let params = {
                accessCode: '0fb3f6123d1b4fe6851c99532c463f6f',
                appKey: '6738b790-69e8-11ec-a673-6805cab640a0',
                atlasFile: {
                  atlasId: this.formData.FILEID1,
                  catIds: '',
                  dwgIds: this.formData.FILEIDCAD,
                  fileIds: this.formData.FILEID3,
                  pdfIds: this.formData.FILEID2
                },
                atlasInfo: {
                  area: this.formData.AREA,
                  atlasName: this.formData.ATLAS_NAME,
                  atlasStyle: '第三方图集',
                  atlasType: '',
                  belongArea: '', //存市1
                  belongCounty: '', //存县
                  buildArea: this.formData.BUILD_AREA,
                  catid: '',
                  citycode: window.localStorage.getItem('citycode'),
                  createdate: '',
                  displayorder: 1,
                  floors: this.formData.FLOORS,
                  id: '',
                  remark: 0,
                  suolueFileId: this.formData.FILEID3,
                  updatedate: '',
                  useNumber: 1,
                  vrUrl: ''
                },
                technicalUnit: this.formData.technicalUnit
              }
              const res = await zhejiangHouseAtlasSave(params)
              if (res.data.code == 200) {
                this.$toast.success('成功！')
                this.getTJ()
                window.localStorage.setItem('ISTUJI', false)
                this.$store.commit('getJFTZ', res.data.data.atlasInfo)
                window.sessionStorage.setItem('ISPdf', '是')
                if (JSON.parse(window.sessionStorage.getItem('fileData'))?.S) {
                  this.$router.push({
                    path: 'fileData'
                  })
                } else {
                  this.$router.push({
                    path: 'ChooseCraftsman'
                  })
                }
              }
            } else {
              this.$toast.fail('请输入必填项！')
            }
          } 
        
        
      //控制只能从选图选工匠环节介入上传
    },
    getTJ: async function (data) {
      let params = {
        accessCode: '29ff26f660fc47f79c15bff382eeca6d',
        appKey: '6738b790-69e8-11ec-a673-6805cab640a0',
        userId: window.localStorage.getItem('ISZHUCE'),
        pageNo: 1,
        pageSize: 1000
      }
      const res = await AtlasCollection(params)
      res.data.data.pageList ? (this.imagesList = res.data.data.pageList) : ''
    },
    onClick(name, title) {
      if (window.localStorage.getItem('SSZZ_CITYNAME')) {
        this.text.message = `请联系${window.localStorage.getItem('SSZZ_CITYNAME')}乡镇人民政府审核图纸`
      } else {
        this.text.message = `请联系${window.localStorage.getItem('TOWN_CITYNAME')}街道办事处审核图纸`
      }
      this.ISTUJI = true
      if (name == 1) {
        this.getTJ()
      }
      if (title == '图集上传' && this.$route.query.data) {
        //todo
        // this.shoulm = true
      }
    },
    handleClose() {
      this.shoulm = false
      //取消时必须选择通用图集
      this.activeName = 'first'
      this.onClick(0, '免费图集')
      window.localStorage.setItem('ISTUJI', false)
      this.ISTUJI = false
    },
    handleOk() {
      this.shoulm = false
      //确定时不用选择图集
      this.ISTUJI = true
      window.localStorage.setItem('ISTUJI', true)
      this.$router.push({
        path: 'ChooseCraftsman'
      })
    }
  },
  mounted() {
    this.getTJ()
    this.formData.atlasStyle = '自传图集'
    this.showEdition = this.$store.state.Edition
    if (ZWJSBridge) {
      ZWJSBridge.setTitle({
        title: '图集服务'
      })
        .then((res) => {})
        .catch((err) => {})

      // this.tableData = this.$route.query.data
      // this.ZDMJ = this.tableData.AREACOVERED
      // this.JZMJ = this.tableData.JZMJ
      // // this.showPicker = this.tableData.BUILDSTOREY
      // this.ZZGD = this.tableData.BUILDHEIGHT
      // this.showPicker1 = this.tableData.MASONRYTYPE
      // this.QWSC = this.tableData.WALLCOLOR
    }
  }
}
</script>
<style lang="scss">
#BuildingServer {
  height: 100vh;
  overflow: auto;
  background: #fff;
  font-size: 14px;
  position: relative;
  .top {
    height: 70px;
    background: #ffffff;
    margin-bottom: 20px;
    padding-top: 25px;
    text-align: center;
    .origin {
      width: 22px;
      height: 22px;
      background: #007aff;
      border-radius: 50%;
      display: inline-block;
    }
    .line {
      width: 20vw;
      /*height: 1px;*/
      border: 1px dashed #007aff;
      display: inline-block;
    }
  }
  .title {
    width: 100%;
    height: 50px;
    background: #007aff;
    line-height: 50px;
    text-align: center;
    color: #ffffff;
    font-size: 20px;
    position: relative;
  }
  .el-tabs__nav {
    margin-left: 80px !important;
  }
  .pcStyle {
    .el-tabs__nav {
      margin-left: 10px !important;
    }
  }
  .boxser {
    width: 45%;
    // height: auto;
    // border: 1px solid #aaa;
    box-shadow: 0 0 12px #e3e3e3;
    float: left;
    margin: 1.5% 1.5% 1.5% 3%;
    border-radius: 10px;
    img {
      width: 100%;
      border-radius: 10px 10px 0 0;
    }
  }
  .linStyle {
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #d2d2d2;
    font-size: 14px;
    display: flex;
    color: #646566;
    justify-content: space-between;
    padding: 12px 14px;
    span {
      margin-right: 6px;
    }
  }
  .tjsc_wrap {
    width: 100%;
    height: calc(100vh - 280px);
    overflow: auto;
  }
  .footer {
    text-align: center;
    
    
    .van-button {
      width: 90vw;
    }
  }
}
</style>
<style lang="scss">
#BuildingServer {
  .van-field__control {
    text-align: right;
  }
  .el-upload-list {
    position: absolute;
    left: 4%;
  }
  .van-field__label {
    width: auto !important;
  }
  .van-cell {
    padding: 0 !important;
    color: #646566 !important;
  }
  .van-field__label {
    color: #646566 !important;
  }
  .van-button--primary {
    background-color: transparent !important;
    border: 1px solid #1288fe;
    color: #1288fe;
  }
  .van-popup {
    border-radius: 10px;
    .con_box {
      width: 270px;
      line-height: 1;
      text-align: center;
      color: #4d5c82;
      padding: 15px;
      box-sizing: border-box;
      > h3 {
        font-size: 20px;
        margin-top: 10px;
        margin-bottom: 20px;
      }
      > p {
        font-size: 17px;
        margin-bottom: 30px;
      }
      .btnv {
        display: flex;
        justify-content: space-between;
        > span {
          display: block;
          width: 114px;
          background-color: #e0e5f5;
          text-align: center;
          line-height: 44px;
          font-size: 17px;
        }
        > span:last-of-type {
          background-color: #1288fe;
          color: #ffffff;
        }
      }
    }
  }
}
</style>
